// pages/search/search.js
import request from "../../utils/request";

let isSend = false;//函数节流使用
Page({

    /**
     * 页面的初始数据
     */
    data: {
        placeholderContent: '',//placeholder默认内容
        hotList: [],//热搜榜数据
        searchValue: '',//用户输入的表单项数据
        searchList: [],//关键字模糊匹配的数据
        cancelShow: false,
        historyList: [],//搜索历史记录
    },

    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {
        this.getInitData();

        //获取历史记录
        this.getSearchHistory()
    },
    //获取初始化的数据
    async getInitData() {
        let placeholderData = await request('/search/default');
        let hotListData = await request('/search/hot/detail');
        // console.log(placeholderData)
        this.setData({
            placeholderContent: placeholderData.data.showKeyword,
            hotList: hotListData.data,
        })
        console.log(hotListData)
    },

    //获取本地历史记录的功能函数
    getSearchHistory() {
        let historyList = wx.getStorageSync('searchHistory')
        if (historyList) {
            this.setData({
                historyList
            })
        }
    },

    //表单项内容发生改变的回调
    searchValueInput: function (event) {
        //更新searchValue的状态数据
        this.setData({
            searchValue: event.detail.value.trim()
        })

        if (isSend) {
            return
        }
        isSend = true;
       this.getSearchList();
        //函数节流：防抖
        setTimeout(() => {
            isSend = false;
        }, 300)

        //显示 x 号
        if (event.detail.value.trim().length) {
            this.setData({
                cancelShow: true,
            })
        }
    },

    //获取搜索数据的功能函数
    async getSearchList() {
        if (!this.data.searchValue) {
            this.setData({
                searchList: [],
            })
            return;
        }
        let {searchValue, historyList} = this.data;
        //发请求获取关键字模糊匹配数据
        let searchListData = await request('/search', {keywords: searchValue, limit: 10});
        this.setData({
            searchList: searchListData.result.songs
        })
            console.log(searchListData.result.songs[0].id)

        //将搜索的关键字添加到搜索历史记录中
        if (historyList.indexOf(searchValue) !== -1) {
            historyList.splice(historyList.indexOf(searchValue), 1)
        }
        historyList.unshift(searchValue);
        this.setData({
            historyList
        })

        wx.setStorageSync('searchHistory', historyList)
    },

    //删除输入功能函数
    cancelInput() {
        this.setData({
            searchValue: '',
            cancelShow: false,
            searchList: []
        })
    },

    //删除搜索历史记录
    deleteSearchHistory() {
        wx.showModal({
            content: '确认是否清空历史记录?',
            success: (res) => {
                if (res.confirm) {
                    //清空data中的historyList
                    this.setData({
                        historyList: []
                    })
                    //移除本地的历史记录缓存
                    wx.removeStorageSync('searchHistory');
                }
            }
        })
    },

    //跳转至songDetail页面
    toSongDetail(event) {
        console.log(event)
        let songId = event.currentTarget.dataset.id;

        //路由跳转传参: query参数
        wx.navigateTo({
            // 不能直接将song对象作为参数传递，长度过长，会被自动截取掉
            // url: '/pages/songDetail/songDetail?song=' + JSON.stringify(song)
            url: '../../songPackage/pages/songDetail/songDetail?musicId=' + songId
        })
    },

    backToLast() {
        wx.navigateBack()
    },

    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {

    },

    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {

    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {

    },

    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {

    },

    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {

    },

    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {

    },

    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {

    }
})